import React, { useState } from 'react';
import { Picture, SwiperBox } from "@/design";
import { Scroll, Position } from '@/components/Scroll/Scroll';
import Nav from './Nav';
import styles from './home.less';
import productData from './menu.json';

export default function home() {
  const [index, setIndex] = useState(0);
  const [fixHead, setFixHead] = useState(false);

  console.log('======', productData.categoryList)
  return (
    <>
      <div className={styles.header}>
        <span>桌台</span>
        <span>搜索框</span>
      </div>
      {/* 热门推荐 */}
      <div className={styles.header_hidden}></div>

      {/* 没登录的提示card */}
      <div className={styles.login_remind_card}>
        登录提醒card
      </div>
      <div className={styles.login_remind_card_hidden}></div>
      <div className={styles.hot_recommendation}>热门推荐 content</div>
      <div className={styles.meal_set_style}>
        <ul className={styles.menu_list_style}>
          <li>菜单</li>
          <li>菜单</li>
          <li>菜单</li>
        </ul>
        <div className={styles.meal_list_style}>
          <div className={styles.category_list_header}>川菜</div>
          <ul className={styles.menu_list}>
            <div className={styles.meal_list_category_container}></div>
            <li className={styles.meal_detail_set }>
              <div className={styles.dish_item}>
                <div className={styles.dish_img_wrapper}>
                  <img  className={styles.dish_img} src="https://p0.meituan.net/rmscashier/f87a1a62aa44a08a39cce0bff2a1bd271449547.jpg%40180w_180h_1e_1c_1l%7Cwatermark%3D0.webp" alt=""/>
                </div>
                <div className={styles.dish_details}></div>
              </div>
            </li>
          </ul>
        </div>
      </div>
    </>
  )
}

